 <!-- 编辑商品 -->
<template>
    <div class="page">
        <!-- 面包屑 -->
        <el-breadcrumb separator-class="el-icon-arrow-right">
            <el-breadcrumb-item :to="{ path: '/home', name: '' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/goods', name: '' }">商品管理</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/goods', name: '' }">商品编辑</el-breadcrumb-item>
        </el-breadcrumb>

        <el-card shadow="always" :body-style="{ padding: '20px' }">
            <div slot="header">
                <span>商品编辑</span>
            </div>
            <el-row type="flex" justify="center">
              <el-col :span="15">
                <el-form :model="form" ref="form" :rules="rules" label-width="80px" :inline="false" size="normal">
                    <el-form-item label="商品名称">
                        <el-input type="textarea" rows="4" v-model="form.goods_title"></el-input>
                    </el-form-item>

                    <el-form-item label="商品描述">
                        <el-input type="textarea" v-model="form.goods_des"></el-input>
                    </el-form-item>

                    <el-form-item label="商品产地">
                        <el-input type="textarea" v-model="form.place"></el-input>
                    </el-form-item>

                    <el-form-item label="商品单价">
                        <el-row :gutter="12">
                          <el-col :span="10">
                            <el-input type="price" v-model="form.unit_price"></el-input>
                          </el-col>
                           <el-col :span="1">
                              <span>元</span>
                          </el-col>
                        </el-row>
                    </el-form-item>


                    <el-form-item label="商品库存">
                        <el-row :gutter="12">
                          <el-col :span="10">
                            <el-input type="price" v-model="form.stock"></el-input>
                          </el-col>
                          <el-col :span="1">
                              <span>件</span>
                          </el-col>
                        </el-row>
                    </el-form-item>

                    <el-form-item label="商品封面">
                        <el-upload list-type="picture-card" :file-list="form.banner_imvs" :limit="3">
                        <i class="el-icon-plus"></i>
                        </el-upload>
                       
                    </el-form-item>

                    <el-form-item label="商品详情图">
                        <el-upload list-type="picture-card" :file-list="form.detail_imvs" :limit="3">
                        <i class="el-icon-plus"></i>
                        </el-upload>
                       
                    </el-form-item>


                    <el-form-item>
                        <el-button type="primary" size="medium" @click="submitBtnClick">提交修改</el-button>
                    </el-form-item>

                    


                </el-form>
            
              </el-col>
            </el-row>


        
        </el-card>


    </div>
</template>

<script>
    export default {
        mounted(){
            this.goodsId = this.$route.query.goodsId
            this.netFetchGoodsDetail()
        },
        data(){
            return {
                goodsId :'',
                form:{},
                FileList:[
                    {name:'',url:""},
                    {name:'',url:""},
                ]
            }
        },
        methods:{
            // action
            submitBtnClick() {
                this.netUpdateGoods()
            },

            // net
            async netFetchGoodsDetail() {
                let self = this
                let {data} = await this.$http.get("/goods/detail?gid=" + this.goodsId)
                let code = data.code;
                if(code == 0) {
                    self.form = data['data'];
                } else {
                    self.$message.error(data.msg)
                }
            },

            async netUpdateGoods() {
                let self = this
                let {data} = await this.$http.post("/goods/update",this.form)
                let code = data.code;
                if(code == 0) {
                    self.$message.success(data.msg)
                    setTimeout(() => {
                        self.$router.back()
                    }, 2000);
                } else {
                    self.$message.error(data.msg)
                }
            }
        },
    }
</script>


<style scoped>

</style>